<script setup lang="ts">
    import {ref}from 'vue'
    import {loginFn} from '@/api/user';
    import {showFailToast } from 'vant';
    import { useRouter,useRoute } from 'vue-router';
    const loginname =ref('')
    const router=useRouter()
    const route=useRoute()
    const password =ref('')
    import {useUserstore} from '@/stores/user'
    // const pattern=ref(/^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_!@#$%^&*`~()-+=]+$)(?![a-z0-9]+$)(?![a-z\W_!@#$%^&*`~()-+=]+$)(?![0-9\W_!@#$%^&*`~()-+=]+$)[a-zA-Z0-9\W_!@#$%^&*`~()-+=]/)
    

    //++++++++++++++++++++++++++++pinia全局状态+++++++++++++++++++++++++++++++++    
    //获取全局变量数据
    const user=useUserstore()



    //登录
    function onSubmit(){
        loginFn({loginname: loginname.value,password:password.value}).then(res=>{
            if(res.data.code==200){
                showFailToast(res.data.message)
                //将数据放入全局状态
                user.changeUseState({
                    loginState:true,
                    userid:res.data.data.userid,
                    token:res.data.data.token
                })

                //返回上一个页面
                //判断页面是否从注册页面跳转过来
                if(route.query.type=='10086')
                {
                    //来自于注册页面
                    router.push('/')
                }else{
                    router.back()
                }
            }else{
                showFailToast(res.data.message)
            }
        })
    }


</script>

<template>
    <main class="box">
        <header class="header">
            <span>头部-登录</span>
        </header>
        <div class="content">
            <van-form @submit="onSubmit">
            <van-cell-group inset>
                <van-field
                v-model="loginname"
                name="用户名"
                label="用户名"
                placeholder="用户名"
                :rules="[{ required: true, message: '请填写用户名' }]"
                />

                <!-- 添加正则 pattern -->
                <van-field
                v-model="password"
                type="password"
                name="密码"
                label="密码"
                placeholder="密码"
                :rules="[{ required: true, message: '请填写含大小写，数字和特殊符号的密码', }]"
                />
            </van-cell-group>
            <div style="margin: 30px 16px 16px 16px;">
                <van-button round block color="#f66" native-type="submit">
                登录
                </van-button>
            </div>
            <div style="margin: 16px;">
                <van-button @click="$router.push('/register')" round block type="success">
                去注册
                </van-button>
            </div>
            <div style="margin: 16px;">
                <van-button round block type="default">
                忘记密码
                </van-button>
            </div>
            </van-form>
        </div>
    </main>
    
</template>
<style scoped lang="scss">
.content{
    padding-top: 50px;
}
</style>